http://ebux.ir/includes/img/468x60.gif آموزش مقدماتی HTML(قسمت سوم)
 
دنیای کامپیوتر وفناوری اطلاعات

تگ Anchor و شناسه href

   برای ايجاد پيوند به صفحات ديگر از تگ <a> استفاده ميشود. پيوندها ميتوانند به بخش ديگری از همان صفحه، صفحات ديگر وب، تصاوير، فايلهای صوتی يا حتی فيلم ها و ... اشاره کنند.
فرم کلی يک پيوند به قرار زير است:

 

 

   در مثال بالا تگ <a> برای ايجاد پيوندی به صفحه ای ديگر که آدرس اينترنتی آن url ميباشد بکار رفته است. برای تعيين مقصد و يا آدرس صفحه جديد از شناسه ای به نام href که همان hyerlink reference ميباشد، استفاده ميشود و مقدار اين شناسه در واقع همان آدرس اينترنتی صفحه مقصد است. بخش قابل رويت پيوند و در واقع متــنــی (و يا تصويری ) که توسط مرورگر نمايش داده خواهد شد و بازديدکننده روی آن کليک خواهد کرد ميان تگهای <a> و قرار داده ميشود و هر چند که در مثال بالا اين بخش متن "Some Text" است ولی ميتواند حتی يک تصوير باشد.

   برای نمونه کد اچتمل زير پيوندی به سايت google.com ايجاد خواهد کرد:

 

   و مرورگر پيوند بالا را به شکل زير نمايش داده و در اثر کليک روی پيوند توسط بازديدکننده، مرورگر به سايت Google خواهد رفت.

شناسه target در پيوندها:

   با کمک شناسه target امکان تعيين مقصد پيوند جديد فراهم ميشود. در مثال بالا پس از کليک روی پيوند، مرورگر سايت google.com را باز کرده و جايگزين سایت فعلی خواهد شد. اگر ميخواهيد که مرورگر پيوند را در صفحه ای جديد باز کند بايد از شناسه target و مقدار "_blank" برای آن استفاده کنيد . مثال زير سبب باز شدن سايت google.com در پنجره جديدی خواهد شد:

 

 

شناسه Name :

   با کمک شناسه name ميتوانيد پيوندها را نام گذاری کنيد.پيوندهای نامگذاری شده امکان حرکت ميان قسمتهای مختلف يک صفحه يا page را فراهم ميکنند. در اينصورت مثلا برای رفتن به آخر يک متن ديگر نيازی به Scrool down کردن تمامی صفحه نيست و کافی است که بازديدکننده روی پيوندی که به آخر صفحه اشاره ميکند کليک کند.

 
   استفاده از پيوندهای نامگذاری شده شامل دو مرحله است:

 
1- ايجاد يک پيوند نامگذاری شده (اين قسمت به عنوان لنگر کار خواهد کرد.) :

   فرم کلی يک پيوند نام گذاری شده به قرار زير است:

 

 

   وظيفه شناسه name تعيين نام برای پيوند است و مقدارآن همان نام پيوند ميباشد. نام پيوند هم هر نام لاتينی ميتواند باشد. در فرم کلی بالا، نام پيوند label و متنی که بعنوان پيوند نمايش داده ميشود عبارت "Text to be displayed" خواهد بود. مثال زير به ايجاد يک پيوند نامگذاری شده با نام top ميپردازد:

 

 

2- ايجاد يک پيوند به پيوند نامگذاری شده ديگر:

 

   برای دادن لينک به پيوندی نام گذاری شده، کافی است که پيوندی معمولی ايجاد کرده و در قسمت href آن ابتدا url مقصد و سپس نويسه # و در نهايت نام پيوند نامگذاری شده را درج کنيد. مثال زير ايجاد پيوندی است که به لينک نامگذاری شده ای به نام top اشاره ميکند:

 

 

در اثر کليک روی پيوند بالا مرورگر مستقيما به ابتدای بخش top صفحه index.htm خواهد رفت.

  اگر مقصد پيوند در همان صفحه قرار دارد نيازی به قيد url نيست و فقط نويسه # و سپس نام پيوند کافی است:

 

 

چند نکته کاربردی در مورد پيوندها:

*** يکی از کاربردهای رايج پيوندهای نام گذاری شده در صفحات و متونی ميباشد که فهرست و يا ليستی از اقلام نمايش داده شده است، مانند بخش سرفصل مطالب، فهرست FAQ و يا ... در همين صفحه در دو مورد از پيوندهای نامگذاری شده استفاده شده است، آيا ميتوانيد آنها را بيابيد؟!

*** اگر مرورگر نتواند يک پيوند نامگذاری شده را بيابد ابتدای صفحه مقصد را نمايش خواهد داد.

 

Start Tag

Purpose

کاربرد عنصر Anchor

Defines an anchor

تعريف يک پيوند يا Anchor در يک صفحه اچتمل

 

Target Attributes

کاربرد حالتهای مختلف شناسه target

target="_blank"

مرورگر پيوند را در يک پنجره جديد باز ميکند.

target="_self"

مرورگر پيوند را همان پنجره باز ميکند. (حالت پيش فرض يا default)

target="_parent"

مرورگر پيوند را فريم parent باز ميکند. (کاربرد در مبحث فريمها)

target="_top"

مرورگر پيوند را در فريم مادر و اصلی باز ميکند.(روشی خوب برای نجات از شر فريمها )

 

مرجع : HTML 4.01 Specification - فهرست عناصر - فهرست شناسه ها

 

 

ط) جداول ( Tables)

 

   در اين درس با المان جدول ( Table ) ، سلولها يا خانه ها، مرز و border در جداول و تگ های مربوطه مخصوصا تگهای TABLE ، TD , TR آشنا خواهيد شد. توجه داشته باشید که جداول یکی از مهمترین المانهای آرایش و layout میباشند.

جدولها

   برای تعريف جداول از تگ <table> استفاده ميشود. يک جدول از يک يا چند سطر که با کمک تگ <tr> تعريف ميشوند، تشکيل ميشود. هر رديف يا row از يک يا چند سلول، خانه يا cell تشکيل گرديده که با کمک تگ <td> ايجاد ميشوند. نام های td و tr به ترتيب خلاصه شده table row و table data ميباشند.
   محتوی يک سلول ميتواند متن، تصوير، فهرستها، جداول ديگر، پاراگرافها و ... باشد.

مثال زير جدولی است با دو سطر و سه ستون :

 

 

 

 

 

کد اچتمل جدولی با دو سطر و سه ستون

نمايش جدول روبرو توسط مرورگر

رديف 1، سلول 1 رديف 1، سلول 2 رديف 1، سلول 3
رديف 2، سلول 1 رديف 2، سلول 2 رديف 2، سلول 3

 

 

 

 

 

رديف 1، سلول 1

رديف 1، سلول 2

رديف 1، سلول 3

رديف 2، سلول 1

رديف 2، سلول 2

رديف 2، سلول 3

 

جدولها و شناسه border و dir :

  در مثال بالا شناسه border مرز جدول را مشخص ميکند، مقدار 1 مرزی با ضخامت يک پيکسل را نمايش خواهد داد و مقدار صفر جدول را بدون مرز نمايش خواهد داد. توجه داشته باشيد که حالت پيش فرض يعنی جدولی بدون شناسه border ، جداول بدون مرز را نمايش خواهد داد.

  در مثال بالا شناسه dir يا direction و مقدار rtl برای آن، سبب تعيين نمايش جهت متون از راست به چپ خواهد شد و چو ن در داخل تک table تعريف شده است به تمامی سلولهای جدول اعمال خواهذ شد.

  ساده ترين جدول ممکن در اچتمل، جدولی است با يک سطر و يک ستون!

سرستون در جداول (Headings)

   سرستونها در جداول با کمک تگ <th> تعريف ميشوند. مثال زير نحوه تعريف سرستونها را در جداول نمايش ميدهد:


نظرات شما عزیزان:

نام :
آدرس ایمیل:
وب سایت/بلاگ :
متن پیام:

کد اچتمل جدولی با سه سطر و سه ستون

نمايش جدول روبرو توسط مرورگر

سرستون ا
:) :( ;) :D
;)) :X :? :P
:* =(( :O };-
:B /:) =DD :S
-) :-(( :-| :-))
نظر خصوصی

 کد را وارد نمایید:

 

 

 

عکس شما

آپلود عکس دلخواه:







           
یک شنبه 8 اسفند 1389برچسب:html, :: 19:31
Computer Engineer

درباره وبلاگ


سلام .به دنیای کامپیوتر وفناوری اطلاعات خوش آمدید.ما را با نظرتات خود راهنمایی فرمایید.
آخرین مطالب
نويسندگان
پيوندها

تبادل لینک هوشمند
برای تبادل لینک  ابتدا ما را با عنوان دنیای کامپیوتر وفناوری اطلاعات و آدرس computer.it.LoxBlog.ir لینک نمایید سپس مشخصات لینک خود را در زیر نوشته . در صورت وجود لینک ما در سایت شما لینکتان به طور خودکار در سایت ما قرار میگیرد.








نام :
وب :
پیام :
2+2=:
(Refresh)

خبرنامه وب سایت:





آمار وب سایت:  

بازدید امروز : 88
بازدید دیروز : 2
بازدید هفته : 131
بازدید ماه : 131
بازدید کل : 32010
تعداد مطالب : 50
تعداد نظرات : 0
تعداد آنلاین : 1